<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>车货计算器</title>
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/index.css">
    <script src="../js/index.js"></script>
</head>
<body>
<!--div>div*3-->
<div id="all">
    <div id="top">
        <img src="../image/logo.png" alt="">
        <!--(div*2>span)+img-->
        <div><span id="ipt1">购车借款计算</span></div>
        <div><span id="ipt2">购车税费</span></div>
    </div>
    <div id="mid">
        <div id="div1">
            <!--value属性的值为空  = "" -->
            <!--<input type="text" >-->
            <ul>
                <li> <span>裸车价格:<input type="text" id="luochejiage"> 元</span></li>
                <li><span>首付比例:<select>
                        <option value="1c">一成</option>
                        <option value="2c">二成</option>
                        <option value="3c">三成</option>
                    </select>
            </span>
                </li>
                <li><span>
                贷款期限:<select id="daiqi">
                        <option value="6q">6个月(6期)</option>
                        <option value="9q">9个月(9期)</option>
                        <option value="12q">12个月(12期)</option>
                    </select>
            </span></li>
                <li><span>
            贷款年利率:<select id="nianlilv">
                        <option value="5.6">5.6%(6个月及以内)</option>
                        <option value="4.6">4.6%(9个月及以内)</option>
                        <option value="3.6">3.6%(12个月及以内)</option>
                    </select>
                &nbsp&nbsp&nbsp&nbsp&nbsp
                <select id="zhekou">
                        <option value="wu">无折扣</option>
                        <option value="qi">7折</option>
                        <option value="jiu">9折</option>
                </select>
                &nbsp&nbsp
                =<input type="text" id="zongnianlilv">%
            </span></li>
            </ul>





        </div>
        <div id="div2" class="yin">
            <ul>
                <li><span>
                裸车价格:<input type="text" id="luochejiage2">元
            </span></li>
                <li><span>
                车辆排放:<select>
                        <option >1.0l-1.6l</option>
                        <option >1.2l-1.8l</option>
                        <option >1.4l-2.0l</option>
                </select>

            </span></li>
                <li><span>
                计划上牌地:<select id="spd">
                        <option value="bj">B-北京</option>
                        <option value="sh">S-上海</option>
                        <option value="sc">E-四川</option>
                </select>
                (首字母)

            </span></li>
                <li><span>
                车辆情况:<input type="checkbox" id="6zx">六座以下
                <input type="checkbox" id="6zs" >六座以上
            </span></li>
            </ul>


        </div>
        <div>
            <button id="but1">立即计算</button>
            <button id="but2">清除</button>
        </div>
    </div>
    <div id="bot">
        <div id="div3">
            <h1>计算结果</h1><br>

            每月还款 &nbsp&nbsp <input type="text" id="meiyuehuankuan">元<br>
            利息总额 &nbsp&nbsp <input type="text" id="lixizonge">元 &nbsp&nbsp 累计还款总额&nbsp&nbsp
            <input type="text" id="huankuanze">元

        </div>

    </div>
    <div id="div4">
        <h1>计算结果</h1><br>

        费用合计 &nbsp&nbsp <input type="text" id="feiheji">元<br>
        新车购置税 &nbsp&nbsp <input type="text" id="xinchegouzhi">元 &nbsp&nbsp
        车船使用税&nbsp&nbsp<input type="text" id="chechuanshiyong">元<br>
        上牌费用 &nbsp&nbsp <input type="text" id="shangpai">元 &nbsp&nbsp
        交强险费用&nbsp&nbsp<input type="text" id="qiangxian">元


    </div>


</div>
</body>
</html>